<template>
    <view @click="topage(item)">
        <view class="comment-item">
            <view class="avatar">
                <!-- <u-avatar :src='giveAvatar(item)' size="26"></u-avatar> -->
                <van-image round :src="giveAvatar(item)" />
            </view>

            <view class="wrap">
                <view class="username">
                    {{ giveName(item) }}
                    <van-icon name="cross" @click.stop="delComment(item)" v-if="closeBtn" />
                </view>
                <view class="comment-content">{{ item.comment_content }}</view>
                <view class="info">
                    <view class="reply-btn" v-if="!childState">回复 </view>
                    <view>
                        <uni-dateformat :date="item.comment_date" :threshold="[60000,3600000*24*30]">
                        </uni-dateformat>
                    </view>
                    <view>{{ item.province }}</view>
                </view>
            </view>
        </view>
    </view>
</template>

<script setup>
    import {
        giveName,
        giveAvatar
    } from '../../uitls/tools.js'
    defineProps({
        item: {},
        childState: {
            type: Boolean,
            default: false
        },
        closeBtn: {
            type: Boolean,
            default: true
        }
    });
    const db = uniCloud.database();
    let utils = uniCloud.importObject('utiltsObj', {
        customUI: true
    });
    const emits = defineEmits(['plDel']);

    //二级回复页面
    function topage(item) {
        if (childState) return;
        uni.setStorageSync('commentItem', item);
        uni.navigateTo({
            url: '/pages/replay/replay'
        })
    }
    //删除评论
    function delComment(item) {
        let uid = uniCloud.getCurrentUserInfo().uid;
        if (item.user_id[0]._id == uid || getRole('webmaster')) {
            uni.showModal({
                title: '是否要删除评论？',
                success: res => {
                    if (res.confirm) {
                        db.collection('quanzi_comment').doc(item._id).remove();
                        emits('plDel', item._id);
                        if (item.comment_count > 0) {
                            utils.opration('fyquanzi_art', 'comment_count', item.article_id, -1)
                        }
                    }
                }
            })
        } else {
            uni.showToast({
                title: '权限不足',
                icon: 'none'
            })
        }


    }
</script>

<style lang="scss" scoped>
    .comment-item {
        display: flex;

        .avatar {
            width: 100rpx;
            height: 100rpx;
        }

        .wrap {
            flex: 1;
            padding-left: 20rpx;
            padding-bottom: 20rpx;

            .username {
                font-size: 26rpx;
                color: #666;
                padding: 10rpx 0;
                display: flex;
                align-items: center;
                justify-content: space-between;

                .iconfont {
                    font-size: 20rpx;
                    padding: 10rpx;
                    color: #999;
                }
            }

            .comment-content {
                font-size: 34rpx;
                color: #111;
                line-height: 1.8em;
                width: 500rpx;
                word-wrap: break-word;
                word-break: normal;
            }

            .info {
                font-size: 26rpx;
                color: #666;
                display: flex;
                padding: 10rpx 0;
                align-items: center;

                view {
                    margin-right: 25rpx;
                }

                .reply-btn {
                    padding: 6rpx 18rpx;
                    background: #e4e4e4;
                    border-radius: 30rpx;
                }
            }
        }
    }
</style>